<template>
    <v-container>
        <div>
            <p>首页二维码</p>
            <ImageUpload v-model="qr_code" class="mb-4"></ImageUpload>
            <v-row dense no-gutters>
                <v-col>
                    <v-btn depressed color="primary" class="mr-2" @click="save_qr_code" :loading="saving">保存</v-btn>
                </v-col>
            </v-row>
        </div>


        <div style="margin-top: 20px;border-top: 2px solid #b8b3b3">
            <p>登录logo</p>
            <ImageUpload v-model="login_logo" class="mb-4"></ImageUpload>
            <v-row dense no-gutters>
                <v-col>
                    <v-btn depressed color="primary" class="mr-2" @click="save_login_logo" :loading="saving">保存</v-btn>
                </v-col>
            </v-row>
        </div>

        <div style="margin-top: 20px;border-top: 2px solid #b8b3b3">
            <p>注册logo</p>
            <ImageUpload v-model="register_logo" class="mb-4"></ImageUpload>
            <v-row dense no-gutters>
                <v-col>
                    <v-btn depressed color="primary" class="mr-2" @click="save_register_logo" :loading="saving">保存</v-btn>
                </v-col>
            </v-row>
        </div>


        <div style="margin-top: 20px;border-top: 2px solid #b8b3b3">
            <p>抢单网站名称</p>
            <v-text-field
                v-model="app_name"
                label="请输入抢单网站名称"
                required
            ></v-text-field>
            <v-row dense no-gutters>
                <v-col>
                    <v-btn depressed color="primary" class="mr-2" @click="save_app_name" :loading="saving">保存</v-btn>
                </v-col>
            </v-row>
        </div>


    </v-container>
</template>

<script>
    import axios from "axios";
    import ImageUpload from "../../../widgets/ImageUpload.vue";


    export default {
        data: () => ({
            register_logo: '',
            login_logo: '',
            qr_code: '',
            app_name: '',
            saving: false
        }),
        components: {
            ImageUpload,
        },
        created() {
            this.load_qr_code();
            this.load_app_name();
            this.load_login_logo();
            this.load_register_logo();
        },
        methods: {
            load_register_logo() {
                axios.get(`/app/setting/register_logo`).then((response) => {
                    if(response.data.code == 0) {
                        this.register_logo = response.data.data ?  response.data.data : '';
                    }
                })
                    .catch(function () {})
                    .then(function () {
                    });
            },
            save_register_logo() {
                this.saving = true;
                const that = this;
                axios.post(`/app/setting/register_logo`, {value: this.register_logo}).then((response) => {
                    this.$toast.open({
                        message: response.data.msg,
                        type: response.data.code == 0 ? 'success' : 'error',
                        position: 'top-right',
                    });
                })
                    .catch(function () {})
                    .then(function () {
                        that.saving = false;
                    });
            },

            load_login_logo() {
                axios.get(`/app/setting/login_logo`).then((response) => {
                    if(response.data.code == 0) {
                        this.login_logo = response.data.data ?  response.data.data : '';
                    }
                })
                    .catch(function () {})
                    .then(function () {
                    });
            },
            save_login_logo() {
                this.saving = true;
                const that = this;
                axios.post(`/app/setting/login_logo`, {value: this.login_logo}).then((response) => {
                    this.$toast.open({
                        message: response.data.msg,
                        type: response.data.code == 0 ? 'success' : 'error',
                        position: 'top-right',
                    });
                })
                    .catch(function () {})
                    .then(function () {
                        that.saving = false;
                    });
            },


            load_app_name() {
                axios.get(`/app/setting/app_name`).then((response) => {
                    if(response.data.code == 0) {
                        this.app_name = response.data.data ?  response.data.data : '';
                    }
                })
                    .catch(function () {})
                    .then(function () {
                    });
            },
            save_app_name() {
                this.saving = true;
                const that = this;
                axios.post(`/app/setting/app_name`, {value: this.app_name}).then((response) => {
                    this.$toast.open({
                        message: response.data.msg,
                        type: response.data.code == 0 ? 'success' : 'error',
                        position: 'top-right',
                    });
                })
                    .catch(function () {})
                    .then(function () {
                        that.saving = false;
                    });
            },
            load_qr_code() {
                axios.get(`/app/setting/qr_code`).then((response) => {
                    if(response.data.code == 0) {
                        this.qr_code = response.data.data ?  response.data.data : '';
                    }
                })
                .catch(function () {})
                .then(function () {
                });
            },
            save_qr_code() {
                this.saving = true;
                const that = this;
                axios.post(`/app/setting/qr_code`, {value: this.qr_code}).then((response) => {
                    this.$toast.open({
                        message: response.data.msg,
                        type: response.data.code == 0 ? 'success' : 'error',
                        position: 'top-right',
                    });
                })
                .catch(function () {})
                .then(function () {
                    that.saving = false;
                });
            }
        }
    }
</script>
